<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
    // let 关键字就是用来声明变量的
    // 使用let 关键字声明的变量具有块级作用域
    // 在一个大括号中，使用 let 关键字声明的变量才具有块级作用域, var 关键字是不具备这个特点的
    // 防止循环变量变成全局变量
    // 使用 let 关键字声明的变量没有变量提升
    // 使用 let 关键字声明的变量具有暂时性死区特性

    // let a = 10;
    // console.log(a); 

    // if (true) {
    //     let b = 20;
    //     console.log(b);
    //     if (true) {
    //         let c = 30;
    //     }
    //     console.log(c);
    // }
    // console.log(b);


    /** 在一个大括号中，
    使用 let 关键字声明的变量才具有块级作用域,
    var 关键字是不具备这个特点的  **/
    // if (true) {
    //     let num = 100;
    //     var abc = 200;
    // }
    // console.log(abc);
    // console.log(num);


    /**
     * 防止循环变量变成全局变量
     * */
    // for (let i = 0; i < 2; i++) {

    // }
    // console.log(i);



    /**
     * 使用 let 关键字声明的变量没有变量提升
     **/
    // console.log(a);  // a is not defined
    // let a = 10;

    /**
     * 使用 let 关键字声明的变量具有暂时性死区特性
     * **/
    var num = 10;
    if (true) {
        // 一旦在块级作用域中使用 let 关键字声明变量，这个变量就会和这个块级作用域整体进行了绑定
        // 在这个块级作用域中使用 num 变量和外部的 num 变量是没有任何关系的
        console.log(num);
        let num = 20;
    }
    </script>
</body>
</html>